<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- Primary Meta Tags -->
    <title>
      Paint Board - Open Source Creative Canvas | Draw, Design & Create Online
    </title>
    <meta
      name="title"
      content="Paint Board - Open Source Creative Canvas | Draw, Design & Create Online"
    />
    <meta
      name="description"
      content="A powerful web-based creative canvas for drawing, designing, and digital art creation."
    />
    <meta
      name="keywords"
      content="drawing board, paint board, html canvas, canvas, digital art, online drawing, creative tools, web design, sketch, illustration, AI image segmentation, drawing app, design tool"
    />
    <meta name="author" content="Leo" />
    <meta name="robots" content="index, follow" />
    <meta name="language" content="English" />
    <meta name="revisit-after" content="7 days" />

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://lhrun.github.io/paint-board/" />
    <meta
      property="og:title"
      content="Paint Board - Open Source Creative Canvas"
    />
    <meta
      property="og:description"
      content="A powerful web-based creative canvas for drawing, designing, and digital art creation."
    />
    <meta
      property="og:image"
      content="https://raw.githubusercontent.com/LHRUN/file-store/main/paint-board/logo.png"
    />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:site_name" content="Paint Board" />
    <meta property="og:locale" content="en_US" />

    <!-- Twitter -->
    <meta property="twitter:card" content="summary_large_image" />
    <meta
      property="twitter:url"
      content="https://lhrun.github.io/paint-board/"
    />
    <meta
      property="twitter:title"
      content="Paint Board - Open Source Creative Canvas"
    />
    <meta
      property="twitter:description"
      content="A powerful web-based creative canvas for drawing, designing, and digital art creation."
    />
    <meta
      property="twitter:image"
      content="https://raw.githubusercontent.com/LHRUN/file-store/main/paint-board/logo.png"
    />
    <meta property="twitter:creator" content="@Song_LongHao" />

    <!-- Favicon and Icons -->
    <link rel="icon" type="image/svg+xml" href="/paint-board/canvas.svg" />
    <link
      rel="apple-touch-icon"
      sizes="192x192"
      href="/paint-board/pwa-192.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="192x192"
      href="/paint-board/pwa-192.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="512x512"
      href="/paint-board/pwa-512.png"
    />

    <!-- Canonical URL -->
    <link rel="canonical" href="https://lhrun.github.io/paint-board/" />

    <!-- Theme Color -->
    <meta name="theme-color" content="#eef1ff" />
    <meta name="msapplication-TileColor" content="#eef1ff" />

    <!-- Preconnect to external domains for performance -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

    <!-- Structured Data -->
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "WebApplication",
        "name": "Paint Board",
        "description": "A powerful web-based creative canvas for drawing, designing, and digital art creation",
        "url": "https://lhrun.github.io/paint-board/",
        "applicationCategory": "DesignApplication",
        "operatingSystem": "Web Browser",
        "offers": {
          "@type": "Offer",
          "price": "0",
          "priceCurrency": "USD"
        },
        "creator": {
          "@type": "Person",
          "name": "Leo"
        },
        "screenshot": "https://raw.githubusercontent.com/LHRUN/file-store/main/paint-board/logo.png",
        "featureList": [
          "Multiple drawing tools",
          "Shape creation and editing",
          "Layer management",
          "Export functionality",
          "PWA support",
          "Multi-language support"
        ],
        "browserRequirements": "Requires JavaScript. Requires HTML5.",
        "softwareVersion": "2.0.0"
      }
    </script>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>
